WAI-ARIA-Rollen

ARIA-Rollen liefern semantische Bedeutung für Inhalte und ermöglichen es Screenreadern und anderen Tools, mit einem Objekt in einer Weise zu interagieren, die den Erwartungen der Benutzer an diesen Objekttyp entspricht. ARIA-Rollen können verwendet werden, um Elemente zu beschreiben, die nicht nativ in HTML existieren oder existieren, aber noch keine vollständige Browser-Unterstützung haben.

Standardmäßig haben viele semantische Elemente in HTML eine Rolle; zum Beispiel hat <input type="radio"> die Rolle "radio". Nicht-semantische Elemente in HTML haben keine Rolle; <div> und <span> ohne zusätzliche Semantik geben null zurück. Das role-Attribut kann Semantik bereitstellen.

ARIA-Rollen werden HTML-Elementen hinzugefügt, indem role="role type" verwendet wird, wobei role type der Name einer Rolle in der ARIA-Spezifikation ist. Einige Rollen erfordern die Einbeziehung zugehöriger ARIA-Zustände oder -Eigenschaften; andere sind nur in Verbindung mit anderen Rollen gültig.

Zum Beispiel wird <ul role="tabpanel"> von Screenreadern als 'Tab-Panel' angekündigt. Wenn das Tab-Panel jedoch keine verschachtelten Tabs hat, ist das Element mit der Tab-Panel-Rolle tatsächlich kein Tab-Panel und die Zugänglichkeit wurde negativ beeinflusst.

Die ARIA-Zustände und -Eigenschaften, die mit jeder Rolle verbunden sind, sind auf den Seiten der Rollen aufgeführt, wobei jedes Attribut auch eine eigene Seite hat.

ARIA-Rollen-Typen

Es gibt 6 Kategorien von ARIA-Rollen:

1. Dokumentstrukturrollen

Dokumentstrukturrollen werden verwendet, um eine strukturelle Beschreibung für einen Abschnitt von Inhalten bereitzustellen. Die meisten dieser Rollen sollten nicht mehr verwendet werden, da Browser jetzt semantische HTML-Elemente mit der gleichen Bedeutung unterstützen. Die Rollen ohne HTML-Äquivalente, wie Präsentation, Werkzeugleiste und Tooltip-Rollen, bieten Informationen über die Dokumentstruktur für unterstützende Technologien wie Screenreader, da gleichwertige native HTML-Tags nicht verfügbar sind.

Für die meisten Dokumentstrukturrollen sind semantische HTML-Äquivalente verfügbar und unterstützt. Vermeiden Sie die Nutzung von:

application
article (verwenden Sie <article>)
cell (verwenden Sie <td>)
columnheader (verwenden Sie <th scope="col">)
definition (verwenden Sie <dfn>)
directory
document
figure (verwenden Sie stattdessen <figure>)
group
heading (verwenden Sie h1 bis h6)
img (verwenden Sie stattdessen <img> oder <picture>)
list (verwenden Sie entweder <ul> oder <ol>)
listitem (verwenden Sie stattdessen <li>)
meter (verwenden Sie stattdessen <meter>)
row (verwenden Sie <tr> mit <table>)
rowgroup (verwenden Sie <thead>, <tfoot> und <tbody>)
rowheader (verwenden Sie <th scope="row">)
separator (verwenden Sie <hr> wenn es nicht fokussiert ist)
table (verwenden Sie <table>)
term (verwenden Sie <dfn>)

Diese sind der Vollständigkeit halber enthalten, aber in den meisten Fällen selten, wenn überhaupt, nützlich:

2. Widget-Rollen

Widget-Rollen werden verwendet, um gängige interaktive Muster zu definieren. Wie Dokumentstrukturrollen haben einige Widget-Rollen die gleichen Semantiken wie gut unterstützte native HTML-Elemente und sollten daher vermieden werden. Der Hauptunterschied besteht darin, dass Widget-Rollen typischerweise JavaScript für die Interaktion erfordern, während Dokumentstrukturrollen dies oft nicht tun.

Vermeiden Sie die Nutzung von button, checkbox, gridcell, link, menuitem, menuitemcheckbox, menuitemradio, option, progressbar, radio, und textbox, die wir der Vollständigkeit halber aufgenommen haben. Für die meisten sind semantische Äquivalente mit zugänglicher Interaktivität verfügbar und unterstützt. Weitere Informationen finden Sie in der individuellen Rollendokumentation.

Zusammengesetzte Widget-Rollen

Vermeiden Sie die Nutzung von grid, listbox, und radiogroup, die wir der Vollständigkeit halber aufgenommen haben. Weitere Informationen finden Sie in der individuellen Rollendokumentation.

Beachten Sie, dass es auch eine Widget-Rolle (role="widget") gibt, die eine abstrakte Rolle ist und nicht zur Widget-Rollenkategorie gehört.

3. Landmark-Rollen

Landmark-Rollen bieten eine Möglichkeit, die Organisation und Struktur einer Webseite zu identifizieren. Durch das Klassifizieren und Labeln von Abschnitten einer Seite wird strukturelle Information, die visuell durch Layout vermittelt wird, programmatisch repräsentiert. Screenreader verwenden Landmark-Rollen, um eine Tastaturnavigation zu wichtigen Abschnitten einer Seite zu ermöglichen. Verwenden Sie diese sparsam. Zu viele Landmark-Rollen erzeugen "Rauschen" in Screenreadern, was es schwierig macht, das Gesamtlayout der Seite zu verstehen.

4. Live-Region-Rollen

Live-Region-Rollen werden verwendet, um Elemente mit Inhalten zu definieren, die dynamisch verändert werden. Sehende Benutzer können dynamische Änderungen sehen, wenn sie visuell erkennbar sind. Diese Rollen helfen sehbehinderten und blinden Benutzern zu wissen, ob Inhalte aktualisiert wurden. Unterstützende Technologien wie Screenreader können genutzt werden, um dynamische Inhaltsänderungen anzukündigen:

5. Fensterrollen

Fensterrollen definieren Unterfenster innerhalb des Hauptfensterdokuments, wie Pop-up-Modaldialoge:

6. Abstrakte Rollen

Abstrakte Rollen sind nur für die Nutzung durch Browser gedacht, um ein Dokument zu organisieren und zu vereinfachen. Sie sollten nicht von Entwicklern, die HTML-Markup schreiben, verwendet werden. Tun Sie dies nicht, führt es zu keiner aussagekräftigen Information, die unterstützenden Technologien oder Benutzern übermittelt wird.

Vermeiden Sie die Nutzung von command, composite, input, landmark, range, roletype, section, sectionhead, select, structure, widget, und window.

Hinweis: Verwenden Sie keine abstrakten Rollen auf Ihren Webseiten und in Ihren Anwendungen. Sie sind für den Einsatz durch Browser bestimmt. Sie sind nur zur Referenz enthalten.

Warnung: "Abstrakte Rollen werden für die Ontologie verwendet. Autoren DÜRFEN KEINE abstrakten Rollen in Inhalten verwenden." - Die WAI-ARIA-Spezifikation

Auf MDN definierte Rollen

Die folgenden sind die Referenzseiten, die die auf MDN diskutierten WAI-ARIA-Rollen abdecken.

ARIA: `banner`-Rolle: Die banner-Rolle wird verwendet, um einen globalen Seitenkopf zu definieren, der normalerweise ein Logo, den Firmennamen, eine Suchfunktion und möglicherweise die globale Navigation oder einen Slogan enthält. Sie befindet sich in der Regel am oberen Rand der Seite.
ARIA: `feed`-Rolle: Ein feed ist eine dynamisch scrollbare list von articles, in der Artikel am Anfang oder Ende der Liste hinzugefügt oder entfernt werden, während der Benutzer scrollt. Ein feed ermöglicht es Screenreadern, den Lesecursor im Browse-Modus zu verwenden, um sowohl zu lesen als auch durch einen Strom von reichhaltigem Inhalt zu scrollen, der möglicherweise unendlich weiter scrollt, indem mehr Inhalte geladen werden, während der Benutzer liest.
ARIA: `gridcell` Rolle: Die gridcell Rolle wird verwendet, um eine Zelle in einem grid oder treegrid zu erstellen. Sie soll die Funktionalität des HTML-Elements td nachahmen und Informationen im Tabellenstil gruppieren.
ARIA: `spinbutton` Rolle: Die spinbutton Rolle definiert einen Bereichstyp, bei dem erwartet wird, dass der Benutzer einen Wert aus einer Reihe diskreter Optionen auswählt.
ARIA: `structure`-Rolle: Die structure-Rolle ist für dokumentarische Strukturelemente vorgesehen.
ARIA: `tab`-Rolle: Die ARIA tab-Rolle zeigt ein interaktives Element innerhalb einer tablist an, das beim Aktivieren sein zugehöriges tabpanel anzeigt.
ARIA: `treegrid`-Rolle: Die treegrid-Rolle identifiziert ein Element als ein Raster, dessen Zeilen erweitert und reduziert werden können, ähnlich wie bei einem tree.
ARIA: alert-Rolle: Die alert-Rolle ist für wichtige und in der Regel zeitkritische Informationen gedacht. Das alert ist eine Art von status, das als atomare Live-Region verarbeitet wird.
ARIA: alertdialog Rolle: Die alertdialog-Rolle soll bei modalen Benachrichtigungsdialogen verwendet werden, die den Arbeitsablauf eines Benutzers unterbrechen, um eine wichtige Nachricht zu kommunizieren und eine Antwort zu verlangen.
ARIA: Anwendungsrolle: Die application-Rolle signalisiert unterstützenden Technologien, dass ein Element und all seine Kinder ähnlich wie eine Desktop-Anwendung behandelt werden sollten und keine herkömmlichen HTML-Interpretationstechniken verwenden werden sollten. Diese Rolle sollte nur zur Definition sehr dynamischer und desktopähnlicher Webanwendungen verwendet werden. Die meisten mobilen und Desktop-Webanwendungen gelten nicht als Anwendungen in diesem Zusammenhang.
ARIA: button role: Die button Rolle ist für anklickbare Elemente vorgesehen, die eine Reaktion auslösen, wenn sie vom Benutzer aktiviert werden. Das Hinzufügen von role="button" teilt dem Screenreader mit, dass das Element ein Button ist, bietet jedoch keine Button-Funktionalität. Verwenden Sie stattdessen button oder input mit type="button".
ARIA: checkbox role: Die checkbox-Rolle ist für anklickbare interaktive Steuerelemente vorgesehen. Elemente, die role="checkbox" enthalten, müssen auch das aria-checked-Attribut enthalten, um den Status der Checkbox für unterstützende Technologien offenzulegen.
ARIA: columnheader Rolle: Der columnheader-Wert des ARIA-Rollenattributs identifiziert ein Element als eine Zelle in einer Zeile, die Header-Informationen für eine Spalte enthält, ähnlich dem nativen th-Element mit Spaltenbereich.
ARIA: combobox Rolle: Die Rolle combobox identifiziert ein Element als ein input, das ein anderes Element, wie z. B. ein listbox oder grid, steuert, das bei Bedarf dynamisch aufpoppen kann, um dem Benutzer zu helfen, den Wert dieses input festzulegen.
ARIA: command-Rolle: Die command-Rolle definiert ein Widget, das eine Aktion ausführt, aber keine Eingabedaten erhält.
ARIA: complementary Rolle: Die complementary Landmark-Rolle wird verwendet, um einen unterstützenden Abschnitt zu kennzeichnen, der sich auf den Hauptinhalt bezieht, jedoch auch allein stehen kann, wenn er getrennt wird. Diese Abschnitte werden häufig als Seitenleisten oder Hinweiskästen präsentiert. Wenn möglich, verwenden Sie stattdessen das HTML <aside>-Element.
ARIA: composite-Rolle: Die composite abstrakte Rolle zeigt ein Widget an, das navigierbare Nachfolger oder zugeordnete Kinder enthalten kann.
ARIA: contentinfo Rolle: Die contentinfo Rolle definiert eine Fußzeile, die identifizierende Informationen wie Copyright-Informationen, Navigationslinks und Datenschutzerklärungen enthält, die in jedem Dokument innerhalb einer Website zu finden sind. Dieser Abschnitt wird allgemein als Fußzeile bezeichnet.
ARIA: dialog-Rolle: Die dialog-Rolle wird verwendet, um einen HTML-basierten Anwendungsdialog oder ein Fenster zu markieren, das den Inhalt oder die Benutzeroberfläche vom Rest der Webanwendung oder Seite trennt. Dialoge werden im Allgemeinen über den Rest des Seiteninhalts mithilfe einer Überlagerung platziert. Dialoge können entweder nicht-modal (es ist immer noch möglich, mit Inhalten außerhalb des Dialogs zu interagieren) oder modal sein (nur mit dem Inhalt im Dialog kann interagiert werden).
ARIA: directory-Rolle: Die directory-Rolle war für eine Liste von Verweisen auf Mitglieder einer Gruppe gedacht, wie zum Beispiel ein statisches Inhaltsverzeichnis.
ARIA: Dokumentrolle: Die document-Rolle ist für fokussierbare Inhalte innerhalb komplexer zusammengesetzter Widgets oder Anwendungen gedacht, bei denen assistive Technologien den Lesekontext in einen Lesemodus zurückschalten können.
ARIA: form-Rolle: Die form-Rolle kann verwendet werden, um eine Gruppe von Elementen auf einer Seite zu identifizieren, die eine äquivalente Funktionalität zu einem HTML-Formular bieten. Das Formular wird nicht als Landmarkenbereich angezeigt, es sei denn, es hat einen zugänglichen Namen.
ARIA: generic role: Die generic Rolle erstellt ein namenloses Container-Element, das keine eigene semantische Bedeutung hat.
ARIA: grid-Rolle: Die grid-Rolle ist für ein Widget vorgesehen, das eine oder mehrere Reihen von Zellen enthält. Die Position jeder Zelle ist signifikant und kann über Tastatureingaben fokussiert werden.
ARIA: img Rolle: Die ARIA img Rolle kann verwendet werden, um mehrere Elemente innerhalb des Seiteninhalts als ein einziges Bild zu identifizieren. Diese Elemente könnten Bilder, Code-Snippets, Text, Emojis oder andere Inhalte sein, die kombiniert werden können, um Informationen auf visuelle Weise zu vermitteln.
ARIA: input-Rolle: Die abstrakte Rolle input ist eine generische Art von Steuerelement, das Benutzereingaben ermöglicht.
ARIA: landmark-Rolle: Ein Landmark ist ein wichtiger Abschnitt einer Seite. Die landmark-Rolle ist eine abstrakte Superklasse für die ARIA-Rollenwerte für Inhaltsabschnitte, die so wichtig sind, dass Benutzer wahrscheinlich direkt zu ihnen navigieren möchten.
ARIA: link Rolle: Ein link-Widget bietet einen interaktiven Verweis auf eine Ressource. Die Zielressource kann entweder extern oder lokal sein, d.h. entweder außerhalb oder innerhalb der aktuellen Seite oder Anwendung.
ARIA: list-Rolle: Die ARIA list-Rolle kann verwendet werden, um eine Liste von Elementen zu kennzeichnen. Sie wird normalerweise in Verbindung mit der listitem-Rolle verwendet, die dazu dient, ein Listenelement innerhalb der Liste zu identifizieren.
ARIA: listbox-Rolle: Die listbox-Rolle wird für Listen verwendet, aus denen ein Nutzer ein oder mehrere statische Elemente auswählen kann, die im Gegensatz zu HTML select-Elementen Bilder enthalten können.
ARIA: listitem-Rolle: Die ARIA-listitem-Rolle kann verwendet werden, um ein Element innerhalb einer Liste von Elementen zu identifizieren. Sie wird normalerweise in Verbindung mit der list-Rolle verwendet, die dazu dient, einen Listencontainer zu identifizieren.
ARIA: log-Rolle: Die log-Rolle wird verwendet, um ein Element zu identifizieren, das eine Live-Region erstellt, in der neue Informationen in einer sinnvollen Reihenfolge hinzugefügt werden und alte Informationen verschwinden können.
ARIA: main-Rolle: Die main-Landmark-Rolle wird verwendet, um den Hauptinhalt eines Dokuments zu kennzeichnen. Der Hauptinhaltsbereich besteht aus Inhalten, die direkt mit dem zentralen Thema eines Dokuments oder der Hauptfunktion einer Anwendung in Verbindung stehen oder darauf aufbauen.
ARIA: mark Rolle: Die mark Rolle kennzeichnet Inhalte, die zur Referenz oder wegen ihrer Bedeutung im umgebenden Kontext markiert oder hervorgehoben sind.
ARIA: math Rolle: Die math Rolle gibt an, dass der Inhalt einen mathematischen Ausdruck darstellt.
ARIA: menu Rolle: Die menu-Rolle ist eine Art zusammengesetztes Widget, das dem Benutzer eine Liste von Auswahlmöglichkeiten bietet.
ARIA: Menüelement mit Radio-Button-Funktion: Ein menuitemradio ist ein auswählbares Menüelement in einem Set von Elementen mit derselben Rolle, von denen immer nur eines gleichzeitig ausgewählt sein kann.
ARIA: meter-Rolle: Die meter-Rolle wird verwendet, um ein Element zu identifizieren, das als Meter verwendet wird.
ARIA: none-Rolle: Die none-Rolle ist ein Synonym für die presentation-Rolle; beide entfernen die impliziten ARIA-Semantiken eines Elements, damit sie nicht im Zugänglichkeitsbaum angezeigt werden.
ARIA: note-Rolle: Eine note-Rolle verweist auf einen Abschnitt, dessen Inhalt parenthetisch oder ergänzend zum Hauptinhalt ist.
ARIA: option Rolle: Die option Rolle wird für auswählbare Elemente in einem listbox verwendet.
ARIA: presentation-Rolle: Die presentation-Rolle und ihr Synonym none entfernen die implizite ARIA-Semantik eines Elements aus dem Zugänglichkeitsbaum.
ARIA: radio Rolle: Die radio Rolle ist eine von einer Gruppe von auswählbaren Optionsfeldern in einer radiogroup, bei der nicht mehr als ein einziges Optionsfeld gleichzeitig ausgewählt sein kann.
ARIA: range Rolle: Die abstrakte Rolle range ist eine generische Strukturrolle, die einen Wertebereich repräsentiert.
ARIA: region Rolle: Die region Rolle wird verwendet, um Dokumentbereiche zu identifizieren, die der Autor als signifikant erachtet. Es ist ein generisches Landmark, das zur Unterstützung der Navigation zur Verfügung steht, wenn keine der anderen Landmark-Rollen geeignet ist.
ARIA: roletype Rolle: Die roletype-Rolle, eine abstrakte Rolle, ist die Basisrolle, von der alle anderen ARIA-Rollen erben.
ARIA: Rolle "cell": Der Wert cell des ARIA-role-Attributs identifiziert ein Element als eine Zelle in einem tabellarischen Container, der keine Spalten- oder Zeilenheader-Informationen enthält. Um unterstützt zu werden, muss die Zelle in einem Element mit der Rolle row geschachtelt sein.
ARIA: Rolle "timer": Die timer Rolle zeigt unterstützenden Technologien an, dass ein Element ein numerischer Zähler ist, der entweder die verstrichene Zeit seit einem Startpunkt oder die verbleibende Zeit bis zu einem Endpunkt auflistet. Unterstützende Technologien geben keine Aktualisierungen eines Timers bekannt, da dieser implizit den aria-live Wert off hat.
ARIA: Rolle `article`: Die article-Rolle gibt einen Abschnitt einer Seite an, der leicht eigenständig auf einer Seite, in einem Dokument oder auf einer Website stehen könnte. Sie wird üblicherweise auf zusammenhängende Inhaltselemente wie Kommentare, Forenbeiträge, Zeitungsartikel oder andere auf einer Seite zusammengefasste Elemente angewendet.
ARIA: Rolle `definition`: Die ARIA-Rolle definition zeigt an, dass das Element eine Definition eines Begriffs oder Konzepts ist.
ARIA: Rolle `group`: Die Rolle group identifiziert eine Gruppe von Benutzeroberflächen-Objekten, die nicht von assistiven Technologien in einer Seitenzusammenfassung oder einem Inhaltsverzeichnis berücksichtigt werden sollen.
ARIA: Rolle `heading`: Die Rolle heading definiert dieses Element als eine Überschrift für eine Seite oder einen Abschnitt, wobei das Attribut aria-level für mehr Struktur sorgt.
ARIA: Rolle `menuitem`: Die Rolle menuitem zeigt an, dass das Element eine Option in einer Reihe von Auswahlmöglichkeiten ist, die in einem menu oder menubar enthalten sind.
ARIA: Rolle `scrollbar`: Ein scrollbar ist ein grafisches Objekt, das das Scrollen von Inhalten innerhalb eines Anzeigebereichs steuert.
ARIA: Rolle comment: Die Rolle comment bezeichnet semantisch einen Kommentar/Reaktion auf einige Inhalte auf der Seite oder auf einen vorherigen Kommentar.
ARIA: Rolle der Menuleiste: Eine menubar ist eine Darstellung eines menu, das normalerweise sichtbar bleibt und normalerweise horizontal präsentiert wird.
ARIA: Rolle der Toolbar: Die toolbar-Rolle definiert das enthaltende Element als eine Sammlung von häufig verwendeten Funktionsschaltflächen oder Steuerelementen, die in einer kompakten visuellen Form dargestellt werden.
ARIA: Rolle figure: Die ARIA figure-Rolle kann verwendet werden, um ein Bild innerhalb des Seiteninhalts zu identifizieren, wenn geeignete Semantiken nicht bereits vorhanden sind. Ein Bild (figure) wird im Allgemeinen als ein oder mehrere Bilder, Code-Snippets oder anderer Inhalt betrachtet, der Informationen auf eine andere Weise vermittelt als ein normaler Textfluss.
ARIA: Rolle marquee: Ein marquee ist eine Art von Live-Region, die nicht wesentliche Informationen enthält, die häufig wechseln.
ARIA: Rolle menuitemcheckbox: Ein menuitemcheckbox ist ein menuitem mit einem ankreuzbaren Zustand, dessen mögliche Werte true, false oder mixed sind.
ARIA: Rolle navigation: Die Rolle navigation wird verwendet, um Hauptgruppen von Links zu identifizieren, die zur Navigation durch eine Website oder Seiteninhalte genutzt werden.
ARIA: Rolle progressbar: Die Rolle progressbar definiert ein Element, das den Fortschrittsstatus für Aufgaben anzeigt, die lange dauern.
ARIA: Rolle radiogroup: Die Rolle radiogroup ist eine Gruppe von radio-Buttons.
ARIA: Rollen für Dokumentstruktur: Die Rollen für Dokumentstruktur in ARIA werden verwendet, um eine strukturelle Beschreibung für einen Abschnitt von Inhalten bereitzustellen.
ARIA: Rollenbeschreibung `treeitem`: Ein treeitem ist ein Element in einem tree.
ARIA: row-Rolle: Ein Element mit role="row" ist eine Reihe von Zellen innerhalb einer tabellarischen Struktur. Eine Zeile enthält eine oder mehrere Zellen, Rasterzellen oder Spaltenüberschriften und möglicherweise eine Zeilenüberschrift innerhalb eines grid, table oder treegrid und optional innerhalb eines rowgroup.
ARIA: rowgroup-Rolle: Ein Element mit role="rowgroup" ist eine Gruppe von rows innerhalb einer tabellarischen Struktur. Ein rowgroup enthält eine oder mehrere Reihen von cells, grid cells, column headers oder row headers innerhalb eines grid, table oder treegrid.
ARIA: rowheader Rolle: Ein Element mit role="rowheader" ist eine Zelle, die Kopfzeileninformationen für eine Zeile innerhalb einer tabellarischen Struktur eines grid, table oder treegrid enthält.
ARIA: search Rolle: Die search-Rolle wird verwendet, um die Suchfunktionalität zu identifizieren; den Abschnitt der Seite, der verwendet wird, um die Seite, die Website oder eine Sammlung von Websites zu durchsuchen.
ARIA: searchbox Rolle: Die searchbox Rolle zeigt an, dass ein Element eine Art von textbox ist, das für die Angabe von Suchkriterien vorgesehen ist.
ARIA: section Rolle: Die section Rolle, eine abstrakte Rolle, ist eine Superklassenrolle für darstellbare strukturelle Containment-Komponenten.
ARIA: sectionhead-Rolle: Die sectionhead-Rolle, eine abstrakte Rolle, ist die Superklassenrolle für Bezeichnungen oder Zusammenfassungen des Themas des zugehörigen Abschnitts.
ARIA: select Rolle: Die select Rolle, eine abstrakte Rolle, ist die Superklassenrolle für Formular-Widgets, die es dem Benutzer ermöglichen, aus einer Auswahl von Optionen zu wählen.
ARIA: separator Rolle: Die separator-Rolle zeigt an, dass das Element ein Trenner ist, der Abschnitte von Inhalten oder Gruppen von Menüelementen trennt und unterscheidet. Die implizite ARIA-Rolle des nativen thematischen Trennstrichs hr ist separator.
ARIA: slider-Rolle: Die slider-Rolle definiert ein Eingabeelement, bei dem der Benutzer einen Wert innerhalb eines vorgegebenen Bereichs auswählt.
ARIA: status Rolle: Die status Rolle definiert einen Live-Bereich, der beratende Informationen für den Benutzer enthält, die nicht wichtig genug sind, um ein alert zu sein.
ARIA: suggestion-Rolle: Die suggestion-Rolle kennzeichnet semantisch eine einzelne vorgeschlagene Änderung an einem bearbeitbaren Dokument. Diese sollte auf einem Element verwendet werden, das ein Element mit einer insertion-Rolle und eines mit einer deletion-Rolle umschließt.
ARIA: switch-Rolle: Die ARIA switch-Rolle ist funktional identisch mit der checkbox-Rolle, außer dass sie anstelle der Zustände "checked" und "unchecked", die recht allgemein sind, die Zustände "on" und "off" darstellt.
ARIA: table-Rolle: Der table-Wert des ARIA role-Attributs identifiziert das Element, das die Rolle einer nicht-interaktiven Tabellenstruktur mit Daten enthält, die in Reihen und Spalten angeordnet sind, ähnlich dem nativen table HTML-Element.
ARIA: tablist-Rolle: Die tablist-Rolle identifiziert das Element, das als Container für eine Gruppe von tabs dient. Der Tab-Inhalt wird als tabpanel-Elemente bezeichnet.
ARIA: tabpanel Rolle: Das ARIA tabpanel ist ein Container für die Ressourcen von geschichtetem Inhalt, der mit einem tab verbunden ist.
ARIA: term-Rolle: Die term-Rolle kann für ein Wort oder einen Satz verwendet werden, mit einer optionalen zugehörigen definition.
ARIA: textbox Rolle: Die textbox Rolle wird verwendet, um ein Element zu identifizieren, das die Eingabe von Freiformtext ermöglicht. Wann immer möglich, verwenden Sie anstelle dieser Rolle ein input-Element mit type="text" für einzeilige Eingaben oder ein textarea-Element für mehrzeilige Eingaben.
ARIA: tooltip Rolle: Ein tooltip ist eine kontextbezogene Textblase, die eine Beschreibung für ein Element anzeigt und bei Mauszeiger-Hover oder Tastaturfokus erscheint.
ARIA: tree-Rolle: Ein tree ist ein Widget, das es dem Benutzer ermöglicht, ein oder mehrere Elemente aus einer hierarchisch organisierten Sammlung auszuwählen.
ARIA: Widget-Rolle: Die widget-Rolle, eine abstrakte Rolle, ist eine interaktive Komponente einer grafischen Benutzeroberfläche (GUI).
ARIA: window-Rolle: Die window-Rolle definiert ein Browser- oder App-Fenster.